import React from 'react';
import { Card,Button, notification } from 'antd';
import './ui.less'
class Notification extends React.Component{
    
    openNotice = (type,placement)=>{
        placement && notification.config({
            placement
        })
        notification[type]({
            message:"发工资了",
            description:"上个月实际到账20000元"
        })
    }
    render(){
        return(
        <div style={{width:'100%'}}>
            <Card title="通知提醒框" className="card-wrap">
                <Button type="primary" onClick={()=>{this.openNotice('success')}}>success</Button>,
                <Button type="primary" onClick={()=>{this.openNotice('info')}}>info</Button>,
                <Button type="primary" onClick={()=>{this.openNotice('warning')}}>warning</Button>,
                <Button type="primary" onClick={()=>{this.openNotice('error')}}>error</Button>,
            </Card>
            <Card title="通知提醒框" className="card-wrap">
                <Button type="primary" onClick={()=>{this.openNotice('success','topLeft')}}>success</Button>,
                <Button type="primary" onClick={()=>{this.openNotice('info','topRight')}}>info</Button>,
                <Button type="primary" onClick={()=>{this.openNotice('warning','bottomLeft')}}>warning</Button>,
                <Button type="primary" onClick={()=>{this.openNotice('error','bottomRight')}}>error</Button>,
            </Card>
        </div>
        )
    }
}


export default Notification;
